<template id="refund">
    <div>
        <div class="refund_top">
            <h3>申请退款</h3>
            <img src="../image/dayu.jpg" alt="" @click="getRefund()">
        </div>
        <p class="refund_time">{{orders.pay_time}}</p>
		
        <div class="refund"  v-for="(item, index) in orders.goods" >
            <div class="refund_2">
                <span>{{item.goods_name}}</span>
                <span>{{item.goods_share}} {{item.goods_weight}}</span>
                <span>¥{{item.goods_price}}</span>
				<img v-bind:src="item['goods_thumb']" alt="">
            </div>
            <p class="refund_p1">
                <span @click="refundDetail(orders.order_id,item.goods_id)">申请退款</span>
            </p>

        </div>


    </div>
</template>
<script>
    export default {
        name:'refund',
		data(){
            return{
                orders:[],
				mode:'back_goods_list',
				order_id:this.$route.query.order_id,
            }
        },
		mounted:function(){
			//初始化
			this.getItems(this.mode,this.order_id);
        },
        methods:{
            refundDetail:function(order_id,goods_id){
				this.$router.push('/refundDetail?order_id='+order_id+'&goods_id='+goods_id);
            },
            getRefund:()=>{
                window.history.go(-1);
            },
			getItems:function(mode,order_id){
				if(!order_id || order_id == 0){
					alert('ID异常');
					window.history.go(-1);
				}

                let url  = this.GLOBAL.BaseUrl+'/mobile/api/v1/Users.php?mode='+mode+'&order_id='+order_id;
                let Data = this.GLOBAL.dataParam();
                
                this.$ajax.post(url,Data).then((res) => {
                    let temp = res.data;
                    if(temp.code == 200){
                       this.orders = temp.data;
                    }else{
                        this.GLOBAL.center_error(this,temp);        
                    }  
                })  

			}
        }
    }
</script>
<style>
    .refund_p1 span{
        width:1.28rem;
        height:0.4rem;
        position:absolute;
        display:block;
        border-radius:0.1rem;
        font-size:0.2rem;
        line-height:0.4rem;
        text-align:center;
    }


    .refund_p1 span:nth-of-type(1){
        color:#828282;
        border:1px solid #828282;
        left:4.89rem;
        top:0.09rem;
    }
    .refund_p1{
        width: 100%;
        height:0.63rem;
        position:relative;

    }
    .refund_p time{
        color:#ffaa55;
    }
    .refund_2 span:nth-of-type(1){
        width:5.16rem;
        height:0.47rem;
        line-height:0.47rem;
        text-indent: 1.34rem;
        color:#353535;
        font-size:0.2rem;
        display:block;
        margin-top:0.14rem;
    }
    .refund_2 span:nth-of-type(2){
        width:5.16rem;
        text-indent: 1.34rem;
        height:0.4rem;
        line-height:0.4rem;
        color:#9e9e9e;
        font-size:0.18rem;
        display:block;
    }
    .refund_2 span:nth-of-type(3){
        width:0.8rem;
        height:0.47rem;
        display:block;
        position:absolute;
        line-height:0.47rem;
        text-align:center;
        color:#474747;
        font-size:0.2rem;
        right:0;
        top:0.13rem;
    }
    .refund_2 img{
        display:block;
        width:0.89rem;
        height:0.89rem;
        position:absolute;
        left:0.3rem;
        top:0.13rem;
    }
    .refund_2{
        width:100%;
        height:1.29rem;
        border-bottom:1px solid #cfcecd;
        position:relative;
    }
    .refund_1 span:nth-of-type(1){
        height:0.24rem;
        width:0.58rem;
        border:1px solid #c8d3b2;
        color:#c8d3b2;
        background:#ffffff;
        position:absolute;
        font-size:0.16rem;
        top:0.19rem;
        left:0.17rem;
        line-height:0.24rem;
        text-align:center;
        border-radius:0.05rem;
    }
    .refund_1 span:nth-of-type(2){
        float:left;
        height:0.61rem;
        width:2.89rem;
        text-align:center;
        line-height:0.61rem;
        color:#636363;
        font-size:0.2rem;
    }
    .refund_1 span:nth-of-type(3){
        height:0.61rem;
        width:2.53rem;
        text-align:center;
        line-height:0.61rem;
        color:#cdcdcd;
        font-size:0.18rem;
        float:right;
    }
    .refund{
        height:1.98rem;
        width:100%;
        border-bottom:0.14rem solid #f5f4f2;

    }
    .refund_time{
        width:100%;
        height:0.61rem;
        border-bottom:1px solid #e1e0de;
        color:#323232;
        font-size:0.17rem;
        line-height:0.61rem;
        text-indent: 0.25rem;
    }
    .refund_top h3{
        width:100%;
        height:0.79rem;
        line-height:0.79rem;
        text-align:center;
        color:#85a45a;
        font-size:0.28rem;
    }
    .refund_top img{
        display:block;
        position:absolute;
        height:0.37rem;
        width:0.31rem;
        left:0.27rem;
        top:0.25rem;
    }
    .refund_top{
        width:100%;
        height:0.79rem;
        border-bottom:1px solid #cfcecd;
        position:relative;
    }
</style>